<template>
    <div style="width: 100%; height: 100%">
        <div class="coursewareLearnContainers">
            <div class="coursewareLearnContainers_content">
                <div class="coursewareLearnContainers_content_list">
                    <div class="coursewareLearnContainers_content_list_item">
                        <i class="el-icon-document coursewareLearnContainers_content_list_item_icon"></i>
                        <div class="coursewareLearnContainers_content_list_item_text">测试课件</div>
                    </div>

                </div>
            </div>
        </div>




    </div>
</template>

<script>

export default {
    name: 'coursewareLearn',
    components: {

    },
    data() {
        return {

        };
    },
    mounted() {
        const { state } = this.$store;


    },
    computed: {
        device() {
            return this.$store.state.device
        }
    },
    methods: {
        handleQuery() {

        },

    },
};
</script>

<style scoped lang="scss">
.coursewareLearnContainers {
    background: #fff;
    height: 100%;
    width: 100%;

    &_content {
        padding: 10px;

        &_list {
            display: flex;
            align-items: center;
            flex-wrap: wrap;

            &_item {
                width: 140px;
                height: 60px;
                cursor: pointer;
                padding: 10px;
                margin-bottom: 20px;
                border-radius: 6px;
                box-shadow: 0px 4px 13px 0px rgba(66, 66, 157, 0.6);
                text-align: center;
                &_icon {
                    font-size: 32px;
                    color:#266eff;
                }

                &_text {
                    font-size: 15px;
                    margin-top:6px;
                    color:#266eff;
                }
            }
        }
    }
}
</style>
